<template>
<!--  <WJHText v-model:value="iptDt" type="password" width="250" maxLength="6" validateLength="4" :validate="true" messageLocation="bottom" v-model:flag="parentFlag"/>-->
<!--  <div>{{iptDt}}</div>-->
<!--  <div>{{parentFlag}}</div>-->
<!--  <WJHText v-model:value="iptDt1" type="number" width="150" maxLength="8" validateLength="6" :validate="true" messageLocation="right" v-model:flag="parentFlag1"/>-->
<!--  <div>{{iptDt1}}</div>-->
<!--  <div>{{parentFlag1}}</div>-->
<!--  <WJHText v-model:value="iptDt2" type="pointNumber" width="150" maxLength="8" validateLength="6" :validate="true" messageLocation="right" v-model:flag="parentFlag2"/>-->
<!--  <div>{{iptDt2}}</div>-->
<!--  <div>{{parentFlag2}}</div>-->
<!--  <WJHText v-model:value="iptDt3" type="email" width="150" maxLength="15" validateLength="10" :validate="true" messageLocation="right" v-model:flag="parentFlag3"/>-->
<!--  <div>{{iptDt3}}</div>-->
<!--  <div>{{parentFlag3}}</div>-->
<!--  <WJHText v-model:value="iptDt4" type="text" validateLength="10" :validate="true" messageLocation="bottom" v-model:flag="parentFlag4"/>-->
<!--  <div>{{iptDt4}}</div>-->
<!--  <div>{{parentFlag4}}</div>-->
  <WJHText v-model:value="iptDt" width="250" type="email" maxLength="12" validateLength="6" :customValidate="customValidate" messageLocation="right" v-model:flag="parentFlag"/>
  <div>{{iptDt}}</div>
  <div>{{parentFlag}}</div>
</template>

<script>
import WJHText from './components/WJHText.vue'

export default {
  name: 'App',
  components: {
    WJHText
  },
  data(){
    return{
      iptDt:'',
      parentFlag:false,
      iptDt1:'',
      parentFlag1:false,
      iptDt2:'',
      parentFlag2:false,
      iptDt3:'',
      parentFlag3:false,
      iptDt4:'',
      parentFlag4:false,
    }
  },
  methods:{
    customValidate(text){
      if (text.length<9){
        return {
          flag:false,
          message:"小于9"
        }
      }else {
        return {
          flag:true,
          message:""
        }
      }
    },
  }
}
</script>
